<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <script type="text/javascript" src="js/lib/jquery-1.7.2.min.js"></script>
  <title>Video Sample</title>
<style type="text/css">
#local {
    spacing: 4px;
    float: left;
    width: 50%;
    -webkit-transform: scale(-1, 1);
  }
</style>
<script type="text/javascript">
  // 成功時に呼ばれる関数
  function onSuccess(stream) {
    try {
      $("#localVideo").prop("src", webkitURL.createObjectURL(stream));
    } catch (e) {
      console.log(e.message);
    }
  }
  
  // 失敗時に呼ばれる関数
  function onError(err) {
    console.log(err);
  }
  try {
    navigator.webkitGetUserMedia({audio:true, video:true}, onSuccess, onError);
    console.log("Requested access to local media with new syntax.");
  } catch (e) {
    try {
      navigator.webkitGetUserMedia("video,audio", onSuccess, onError);
      console.log("Requested access to local media with old syntax.");
    } catch (e) {
      console.log("webkitGetUserMedia failed with exception: " + e.message);
    }
  }
</script>
</head>
<body>
  <section id="container">
    <div id="local">
      <video id="localVideo" autoplay="autoplay" width="80%" height="80%"></video>
    </div>
  </section>
</body>
</html>
